<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title>layui</title>
    <meta name="renderer" content="webkit">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
    <link rel="stylesheet" href="../../js/css/layui.css">
</head>
<body>
<fieldset class="layui-elem-field site-demo-button">
    <legend>备份参数设置</legend>
    <form class="layui-form">
        <div class="amin-content">
            <div class="layui-row layui-col-space15">
                <div class="layui-col-md8">
                    <div class="layui-form-item">
                        <div class="layui-inline">
                            <label class="layui-form-label">按文件大小备份</label>
                            <div class="layui-input-inline">
                                <input type="text" name="title" placeholder="(1 MB = 1024 KB)" autocomplete="on" class="layui-input serach_input layui-btn-sm">
                            </div>
                        </div>
                        <div class="layui-inline">
                            <label class="layui-form-label">按记录数备份</label>
                            <div class="layui-input-inline">
                                <input type="text" name="title" placeholder="(1 MB = 1024 KB)" autocomplete="on" class="layui-input serach_input layui-btn-sm ">
                            </div>
                        </div>
                        <div class="layui-inline">
                            <label class="layui-form-label">备份数据库结构</label>
                            <div class="layui-input-inline">
                                <input type="checkbox" name="like1[write]" lay-skin="primary" title=" (没特殊情况，请选择)" checked="">
                            </div>
                        </div>
                        <div class="layui-inline">
                            <label class="layui-form-label">数据编码</label>
                            <div class="layui-input-inline">
                                <select name="interest" lay-filter="aihao">
                                    <option value=""></option>
                                    <option value="0">UTF8</option>
                                    <option value="1" selected="">GB2312</option>
                                </select>
                            </div>
                        </div>
                        <div class="layui-inline">
                            <label class="layui-form-label">存放格式</label>
                            <div class="layui-input-inline">
                                <input type="radio" name="sex" value="男" title="正常" checked="">
                                <input type="radio" name="sex" value="女" title="十六进制方式">

                            </div>
                        </div>
                        <div class="layui-inline">
                            <label class="layui-form-label">存放目录</label>
                            <div class="layui-input-inline">
                                <input type="text" name="title" placeholder="" autocomplete="on" class="layui-input serach_input layui-btn-sm ">
                            </div>
                        </div>
                        <div class="layui-inline">
                            <label class="layui-form-label">备份选项</label>
                            <div class="layui-input-inline">
                                <select name="interest" lay-filter="aihao">
                                    <option value=""></option>
                                    <option value="0">REPLACE</option>
                                    <option value="1" selected="">GB2312</option>
                                </select>
                            </div>
                            <div class="layui-input-inline">
                                <input type="checkbox" name="like1[write]" lay-skin="primary" title="完整插入" checked="">
                            </div>
                            <div class="layui-input-inline">
                                <input type="checkbox" name="like1[write]" lay-skin="primary" title="转化成MYSQL4.0每组备份间隔" checked="">

                            </div>
                            <div class="layui-input-inline">
                                <input type="text" name="title" placeholder="" style="width:40px;" autocomplete="on" class="layui-input serach_input layui-btn-sm ">
                            </div>
                        </div>

                    </div>
                    <div class="layui-form-item">
                        <div class="layui-input-block">
                            <button class="layui-btn" lay-submit="" lay-filter="demo1">立即提交</button>
                            <button type="reset" class="layui-btn layui-btn-primary">重置</button>
                        </div>
                    </div>
                </div>
                <div class="layui-col-md4">
                    <div class="layui-form-item">
                        <label class="layui-form-label">备份说明</label>
                        <div class="layui-input-block">
                            <textarea placeholder="(系统会生成一个readme.txt)" class="layui-textarea"></textarea>
                        </div>
                    </div>
                    <div class="layui-form-item">
                        <label class="layui-form-label">自增字段删除</label>
                        <div class="layui-input-block">
                            <textarea placeholder="(格式：表名.字段名
多个请用","格开)" class="layui-textarea"></textarea>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </form>
</fieldset>
<table class="layui-hide" id="test" lay-filter="test"></table>
<script type="text/html" id="toolbarDemo">
    <div class="">
        <div class="layui-input-item">
            <div class="layui-inline">
                <button class="layui-btn layui-btn-sm padding_top" lay-event="countyInAdd">开始备份</button>
            </div>
           <div class="layui-inline">
                <button class="layui-btn layui-btn-sm padding_top" >修复数据表</button>
            </div>
            <div class="layui-inline">
                <button class="layui-btn layui-btn-sm padding_top" >优化数据表</button>
            </div>
            <div class="layui-inline">
                <button class="layui-btn layui-btn-sm padding_top" >删除数据表</button>
            </div>
            <div class="layui-inline">
                <button class="layui-btn layui-btn-sm padding_top" >清空数据表</button>
            </div>
        </div>

    </div>
</script>
<script type="text/html" id="switchTpl">
    <input type="checkbox" name="sex" value="{{d.id}}" lay-skin="switch" lay-text="发布|未发布" lay-filter=""sexDemo {d.id=1003 ? 'checked' :  ''}}>
</script>
<script type="text/html" id="barDemo">
    <a class="layui-btn layui-btn-xs" lay-event="edit">编辑</a>
    <a class="layui-btn layui-btn-danger layui-btn-xs" lay-event="del">删除</a>
</script>
<script src="../layui.all.js"></script>
<!-- 注意：如果你直接复制所有代码到本地，上述js路径需要改成你本地的 -->
<script>
    layui.use('table', function(){
        var table = layui.table;
        var laydate = layui.laydate;
        laydate.render({
            elem: "#date"
            ,type: 'datetime'
        });
        laydate.render({
            elem: "#date1"
            ,type: 'datetime'
        });
        table.render({
            elem: '#test'
            ,data:[
                {
                    "id":1,
                    'title':"phone_cms_table",
                    "publish":"MYISAM",
                    "publish_time":'utf8-general_ci',
                    "hits":45,
                    "dian":'99.87KB',
                    "is_up":0,
                    "ip":'0K',
                },
                {
                    "id":1,
                    'title':"phone_cms_table",
                    "publish":"MYISAM",
                    "publish_time":'utf8-general_ci',
                    "hits":45,
                    "dian":'99.87KB',
                    "is_up":0,
                    "ip":'0K',
                },
                {
                    "id":1,
                    'title':"phone_cms_table",
                    "publish":"MYISAM",
                    "publish_time":'utf8-general_ci',
                    "hits":45,
                    "dian":'99.87KB',
                    "is_up":0,
                    "ip":'0K',
                },

                {
                    "id":1,
                    'title':"phone_cms_table",
                    "publish":"MYISAM",
                    "publish_time":'utf8-general_ci',
                    "hits":45,
                    "dian":'99.87KB',
                    "is_up":0,
                    "ip":'0K',
                },
                {
                    "id":1,
                    'title':"phone_cms_table",
                    "publish":"MYISAM",
                    "publish_time":'utf8-general_ci',
                    "hits":45,
                    "dian":'99.87KB',
                    "is_up":0,
                    "ip":'0K',
                },
                {
                    "id":1,
                    'title':"phone_cms_table",
                    "publish":"MYISAM",
                    "publish_time":'utf8-general_ci',
                    "hits":45,
                    "dian":'99.87KB',
                    "is_up":0,
                    "ip":'0K',
                },
                {
                    "id":1,
                    'title':"phone_cms_table",
                    "publish":"MYISAM",
                    "publish_time":'utf8-general_ci',
                    "hits":45,
                    "dian":'99.87KB',
                    "is_up":0,
                    "ip":'0K',
                },
                {
                    "id":1,
                    'title':"phone_cms_table",
                    "publish":"MYISAM",
                    "publish_time":'utf8-general_ci',
                    "hits":45,
                    "dian":'99.87KB',
                    "is_up":0,
                    "ip":'0K',
                },

                {
                    "id":1,
                    'title':"phone_cms_table",
                    "publish":"MYISAM",
                    "publish_time":'utf8-general_ci',
                    "hits":45,
                    "dian":'99.87KB',
                    "is_up":0,
                    "ip":'0K',
                },
                {
                    "id":1,
                    'title':"phone_cms_table",
                    "publish":"MYISAM",
                    "publish_time":'utf8-general_ci',
                    "hits":45,
                    "dian":'99.87KB',
                    "is_up":0,
                    "ip":'0K',
                },
            ]
            // ,url:'/test/table/demo1.json'
            ,toolbar: '#toolbarDemo'
            ,title: '数据库备份'
            ,cols: [[
                {type: 'checkbox', fixed: 'left'}
                ,{field:'id', title:'ID', width:80, fixed: 'left', unresize: true, sort: true}
                ,{field:'title', title:'表名',sort:true}
                ,{field:'publish', title:'类型', width:150}
                ,{field:'publish_time', title:'编码', width:280, sort: true}
                ,{field:'hits', title:'记录数', width:100,sort:true}
                ,{field:'dian', title:'大小',width:100,sort:true}
                ,{field:'is_up', title:'碎片'}
            ]]
            ,page: true
            ,count:20
            ,limit:7
            ,loading:true
            ,size:'lg'
        });
//监听性别操作
        // form.on('switch(sexDemo)', function(obj){
        //    layer.tips(this.value + ' ' + this.name + '：'+ obj.elem.checked, obj.othis);
        // });
        //头工具栏事件
        table.on('toolbar(test)', function(obj){
            var checkStatus = table.checkStatus(obj.config.id);
            switch(obj.event){
                case 'getCheckData':
                    var data = checkStatus.data;
                    layer.alert(JSON.stringify(data));
                    break;
                case 'getCheckLength':
                    var data = checkStatus.data;
                    layer.msg('选中了：'+ data.length + ' 个');
                    break;
                case 'countyInAdd':
                    var openwin=layer.open({
                        type:2,
                        title:"国内新闻添加",
                        content:'./countyInAdd.html',
                        area:['100%','100%'],
                        maxmin:true,
                    });
                    layer.full(openwin);
                    break;
            };
        });

        //监听行工具事件
        table.on('tool(test)', function(obj){
            var data = obj.data;
            //console.log(obj)
            if(obj.event === 'del'){
                layer.confirm('真的删除行么', function(index){
                    obj.del();
                    layer.close(index);
                });
            } else if(obj.event === 'edit'){
                layer.prompt({
                    formType: 2
                    ,value: data.email
                }, function(value, index){
                    obj.update({
                        email: value
                    });
                    layer.close(index);
                });
            }
        });
    });
</script>

</body>
</html>